import { RecommendWrapper } from "@/styles/recommend";
import Image from "next/image";
import React, { FC, memo, ReactElement } from "react";
import { IRecommends } from "../type/homeType";

interface IProps {
  children?: ReactElement;
  recommends?: IRecommends[];
}

const Recommend: FC<IProps> = (props: IProps) => {
  const { recommends = [] } = props;
  return (
    <RecommendWrapper>
      {recommends.map((item) => {
        return (
          <div className="item" key={item.id}>
            <Image width={542} height={300} src={item.picStr} alt="" />
          </div>
        );
      })}
    </RecommendWrapper>
  );
};

export default memo(Recommend);
